<template>
    <div class="alter-pop">
        <div class="pop-bg"></div>
        <div class="pop-wrap">
            <!--普通下单-->
            <div class="pop-title"><span class="close" @click="closeAlter">&times;</span>订单修改</div>
            <div class="pop-con conMain">
                <div class="side-left">
                    <h3>详情</h3>
                    <div class="input-wrap">
                        <em class="title">扫码编号</em>
                        <div class="con">{{info.guid}} / <i>{{info.createdtime}}</i></div>
                    </div>
                    <div id="date-time" class="input-wrap" v-if="info.fixedtime != '' && (info.attribute == 2||info.attribute == 8)">
                        <em class="red title"><em>*</em>预约时间</em>
                        <div class="pointer con" @click="showAppointmentTime">{{info.fixedtime}}</div>
                        <date-time
                            :date="orderTime"
                            :option="orderOption"
                            :limit="limit"
                            class="small"
                            @change="setAppointmentTime"
                        ></date-time>
                    </div>
                    <div class="input-wrap">
                        <em class="title"><em>*</em>输送类别</em>
                        <div class="con pointer" id="classify" @click="selectTab(9)">{{info.dept}}</div>
                    </div>
                    <div class="input-wrap">
                        <em class="title"><em>*</em>输送项目</em>
                        <div class="con pointer" @click="showCatalog">{{info.catalog}}</div>
                    </div>
                    <div class="input-wrap">
                        <em class="title"><em>*</em>输送起点</em>
                        <div id="start" class="con pointer" @click="clickShowStart">{{info.askdept}}</div>
                    </div>
                    <div class="input-wrap">
                        <em class="title"><em>*</em>起点床号</em>
                        <div class="con" @click="showPatients">
                            <input  type="text" class="name" v-model="info.bedno">
                        </div>
                    </div>
                    <div class="input-wrap">
                        <em class="title"><em>*</em>目的地</em>
                        <div class="con pointer" @click="clickShowFinish">{{info.address}}</div>
                    </div>
                    <div class="input-wrap">
                        <em class="title"><em>*</em>携带设备</em>
                        <div class="con pointer" @click="showTackle">{{info.tour}}</div>
                    </div>
                    <div class="input-wrap">
                        <em class="title"><em>*</em>备注</em>
                        <div class="con"><input type="text" class="memo" v-model="info.memo"></div>
                    </div>
                    <button class="btn" @click="submit()">{{submitTxt}}</button>
                    <p class="tips-txt">注：带 <em class="red">*</em> 的为可修改项</p>
                </div>
                <div class="side-right noTitle" v-if="showIndex!=3 && showIndex!=8">
                    <p class="title" v-if="showIndex==9">选择输送类别</p>
                    <p class="title" v-if="showIndex==10">选择输送项目</p>
                    <p class="title" v-if="showIndex==4">选择携带设备</p>
                    <div class="select-wrap">
                        <!--类别-->
                        <ul class="itemUl" v-if="showIndex==9">
                            <li
                                class="itemLi"
                                :key="item.id"
                                v-for="item in classifyLis"
                                v-if="item.title!='物流科'"
                                @click="selectClassify(item.id,item.title)"
                            ><em>vertical-align: middle;</em><span>{{item.title}}</span></li>
                        </ul>
                        <!--项目-->
                        <ul class="itemUl" v-if="showIndex==10">
                            <li class="itemLi" :key="item.id" v-for="item in catalogLis" @click="selectCatalog(item.id,item.title)"><em>vertical-align: middle;</em><span>{{item.title}}</span></li>
                        </ul>
                        <!-- 病人列表 -->
                        <ul class="itemUl" v-if="showIndex==11">
                            <li class="itemLi" :key="item.id" v-for="item in patientLis" @click="selectPatient(item)"><em>vertical-align: middle;</em><span>{{item.Name}}{{item.BedNo == ''?'':' 床号:'+item.BedNo}}</span></li>
                        </ul>
                        <!--设备-->
                        <ul class="itemUl" v-if="showIndex==4">
                            <li :class="[item.isActive ? 'itemLi-active' : '', 'itemLi']" :key="item.id" v-for="item in tackleLis" @click="selectTackle(item.title)"><em>vertical-align: middle;</em><span>{{item.title}}</span></li>
                        </ul>
                        <ul class="itemUl" v-if="showIndex==5">
                            <li class="itemLi" @click="submit()">确定修改</li>
                        </ul>
                    </div>
                </div>
                <div class="side-right noTitle" v-if="showIndex==3 || showIndex==8">
                    <p class="title" v-if="showIndex==3">选择输送目的地</p>
                    <p class="title" v-if="showIndex==8">选择输送起点</p>
                    <vue-cascader
                        :data="addrData"
                        :isMulti="isMulti"
                        :size="addrSize"
                        :backBtnText="btnText"
                        :backBtnStyles="backBtnStyles"
                        :backBtnHover="backBtnHover"
                        :backBtnPosi="backBtnPosi"
                        @callback="getFullName"
                    />
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import dateTime from '../tips/calendar2.vue'
    import today from '../common/today'
    import common from '../common/com'
    import {roomAlias} from '../common/com'
    import {
        tackleUrl, addressUrl, destinationUrl,catalogUrl, classifyUrl
    } from '../common/ajax'
    export default{
        components:{
            'date-time':dateTime
        },
        props:{
            detail:'',
            offDutys:'',
            setbadstatus:'',
            ishandle:'',
            hospital:''
        },
        data(){
            return{
                orderDetail: {},
                inputData: {},
                info:{
                    address: '',
                },
                isUp:true,
                submitTxt:'确定修改',
                patientRom:'',
                //选择的
                classifyId:'',
                catalogId:'',
                showIndex:0,
                //列表的
                classifyLis:[],
                catalogLis:[],
                tackleLis:[],
                patientLis:[],
                finishInput:[],
                //时间
                orderTime:{
                    time:''
                },
                orderOption:{
                    type: 'min',
                    week: ['一', '二', '三', '四', '五', '六', '日'],
                    month: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
                    format: 'YYYY-MM-DD HH:mm',
                    placeholder: '预约时间',
                    inputStyle: {
                        'width':'0',
                        'height':'0'
                    },
                    color: {
                        header: '#46bd9e',
                        headerText: '#fff'
                    },
                    buttons: {
                        ok: '确定',
                        cancel: '取消'
                    },
                    overlayOpacity: 0.5, // 0.5 as default
                    dismissible: true // as true as default
                },
                limit: [
                    {
                        type: 'fromto',
                        from: today.tmr(-1)
                    }
                ],
                roomalias:[],
                // 地址选择
                addrData: [],
                addrSize: 'small',
                isMulti: false,
                btnText: '返回',
                backBtnStyles:{
                    background: '#ffd4c6',
                    color: '#fd2b2b'
                },
                backBtnHover:{
                    background: 'red',
                    color: '#fff'
                },
                backBtnPosi:'top',
                fullName: '',
            }
        },
        methods:{
            getFullName(item){
                let str = item.join(' ')
                if(this.showIndex == 3) {
                    this.info.address = str
                    this.clickShowFinish()
                }
                if(this.showIndex == 8) {
                    this.info.askdept = str
                    this.clickShowStart()
                }
            },
            //关闭
            closeAlter(){
                this.$emit('close');
            },
            //设置预约时间
            showAppointmentTime(){
                jQuery('#date-time .cov-vue-date input').click();
            },
            setAppointmentTime(m){
                this.info.fixedtime = m;
                jQuery('#classify').click()
            },
            //切换
            selectTab(index){
                this.showIndex=index;
            },
            showClassify(){
                jQuery.ajax({
                    url: classifyUrl,
                    type:'post',
                    dataType: 'json',
                    cache: false,
                    success: function(data) {
                        if(data.success){
                            this.classifyLis = data.data.lis
                        }else {
                            throwErrorTips('获取输送类型失败',data.msg)
                        }
                    }.bind(this)
                });
            },
            selectClassify(id,name){
                this.info.dept = name
                this.info.catalog = ''
                this.classifyId = id

                if(name != '病人运送') this.info.tour = ''

                this.showCatalog()
            },
            showCatalog(){
                this.catalogLis = [];
                let id = this.classifyId;
                if(id == 0){
                    for(var val of this.classifyLis){
                        if(val.title == "病人运送"){
                            id = val.id;
                        }
                    }
                }
                jQuery.ajax({
                    url: catalogUrl,
                    type:'post',
                    dataType: 'json',
                    cache: false,
                    data:{'classifyid':id},
                    success: function(data) {
                        if(data.success){
                            this.catalogLis = data.data.lis;
                            this.selectTab(10);
                        }
                    }.bind(this)
                });
            },
            selectCatalog(id,name){
                this.info.catalog = name;
                this.catalogId = id
                //显示关联地址
                jQuery.ajax({
                    url: destinationUrl,
                    type: 'post',
                    dataType: 'json',
                    data: {'classifyid': this.classifyId, 'catalogid': this.catalogId},
                    cache: false,
                    success: function (data) {
                        if (data.success) {
                            if(data.data.end){
                                this.info.address = data.data.end;
                            }
                            
                            if(data.data.start){
                                this.info.askdept = data.data.start
                            }
                            jQuery('#start').click();
                        }
                    }.bind(this)
                });
            },
            selectPatient(val){
                let b = '';
                if(val.BedNo != ''){
                    b = ' '+ val.BedNo
                }
                this.info.bedno = val.Name + b;
                this.selectTab(0);
            },
            loadNewAddress(){
                jQuery.ajax({
                    url: addressUrl,
                    type: 'get',
                    cache: false,
                    success: function(data){
                        if(data.success){
                            var newData = common.roomMerge(data.data, this.hospital)
                            this.addrData = newData;
                        }
                    }.bind(this)
                })
            },
            //加载地址
            loadPatients(){
                let pr = roomAlias.postRoom(this.patientRom);
                this.roomalias = roomAlias.site_alias;
                let m = this.$root.$data.hisErrTips[this.$root.$data.cid] || ''
                jQuery.ajax({
                    url: this.$root.$data.lineUrl[this.$root.$data.cid],
                    type:'get',
                    dataType: 'json',
                    cache: false,
                    data:{ks:pr},
                    success: function(data) {
                        if(data.success){
                            let nlist = [];
                            if(data.data != '' && data.data != null && data.data.length > 0){
                                for(var val of data.data){
                                    val.BedNo = val.BedNo.substring(val.BedNo.length-3)
                                    nlist.push({BedNo:val.BedNo,Name:val.Name})
                                }
                            }else {
                                nlist = [];
                            }
                            this.patientLis = nlist.sort(function(a,b){
                                return a.BedNo - b.BedNo
                            });
                        }else {

                            throwErrorTips('获取病人列表失败',data.msg,m)
                        }
                    }.bind(this),
                    error:function(xhr){
                        throwErrorTips('获取病人列表失败',xhr.status,m)
                    }
                });
            },
            showPatients(){
                let cid = Cookies.get('categoryid');
                if(cid == 28) {
                    this.selectTab(11)
                } else {
                    this.selectTab(0)
                }
            },
            //起点
            clickShowStart(){
                this.selectTab(8);
                this.loadNewAddress();
            },
            //终点
            clickShowFinish(){
                this.selectTab(3);
                this.loadNewAddress();
            },
            //前往方式--携带设备
            loadTackle(){
                jQuery.ajax({
                    url: tackleUrl,
                    type:'post',
                    dataType: 'json',
                    cache: false,
                    success: function(data) {
                        if(data.success){
                            this.tackleLis = data.data.lis;
                            if(this.info.tour != ' ' && this.info.dept == '病人运送'){
                                this.tackleLis.forEach(v => {
                                    this.$set(v, 'isActive', false)
                            })

                                let arr = this.info.tour.split(' / ')
                                this.tackleLis.forEach(v => {
                                    arr.indexOf(v.title) != -1 ? v.isActive = true : v.isActive = false;
                            })
                            }
                        }
                    }.bind(this)
                });
            },
            showTackle(){
                this.loadTackle();
                this.selectTab(4);
            },
            selectTackle(name){
                if(this.info.dept == '病人运送'){
                    if(this.info.tour == '' || this.info.tour == '无' || name == '无'){
                        this.info.tour = name;
                        this.tackleLis.forEach(v => {
                            v.title == name ? v.isActive = true : v.isActive = false;
                    })
                    }else{
                        // 判断name是否已在tackleLis当中
                        if(this.info.tour.indexOf(name) != -1){
                            let arr = this.info.tour.split(' / ');
                            this.info.tour = arr.filter(v => v != name).join(' / ')
                            this.tackleLis.forEach(v => {
                                if(v.title == name) v.isActive = false;
                        })
                        }else{
                            this.info.tour += ` / ${name}`
                            this.tackleLis.forEach(v => {
                                if(v.title == name) v.isActive = true;
                        })
                        }
                    }
                }else{
                    this.info.tour = name;
                    this.selectTab(0);
                }
            },
            getActionText(){
                var action = []
                var arr = [
                    { key: 'fixedtime', txt: '预约时间'},
                    { key: 'dept', txt: '类别'},
                    { key: 'catalog', txt: '项目'},
                    { key: 'askdept', txt: '输送起点'},
                    { key: 'bedno', txt: '起点床号'},
                    { key: 'address', txt: '目的地'},
                    { key: 'tour', txt: '携带设备'},
                    { key: 'memo', txt: '备注'}
                ]
                function compare(a, b) {
                    function p(prop, text){
                        if(a[prop] != b[prop]) {
                            var x = '将' +  text + '“' + b[prop] + '” 更改为 “' + a[prop]+'”';
                            action.push(x)
                        }
                    }
                    for(var i = 0; i < arr.length; i++) {
                        p(arr[i].key, arr[i].txt)
                    }
                }
                compare(this.info, this.inputData)
                this.info.action = action.toString()
            },
            //确定修改
            submit(){
                if(this.info.catalog == ''){
                    this.$Message({type:'error',message:'请选择输送项目！'})
                    return
                }
                if((this.info.dept == '病人运送' || this.info.dept == 'his') && jQuery.trim(this.info.bedno) == ''){
                    if(this.setbadstatus){
                        this.$Message({type:'error',message:'请填写起点病人床号！'})
                        return
                    }else {
                        this.info.bedno = '等医务人员待定'
                    }
                }
                if(jQuery.trim(this.info.address) ==  ''){
                    this.info.address = '等科室医务人员待定'
                }
                //预约时间比较
                if(this.orderTime.time != ''){
                    let setT = new Date(this.orderTime.time.replace(/-/g,'/'));
                    let nowT = new Date(jQuery.ajax({async: false}).getResponseHeader("Date"));
                    let t = setT.getTime() - nowT.getTime();
                    if(t <= 0){
                        this.$Message({type:'error',message:'预约时间必须大于现在的时间！'})
                        return
                    }else if(t >= 15*24*60*60*1000){
                        this.$Message({type:'error',message:'不能预约超15天'});
                        return
                    }
                }
                this.getActionText()
                if(this.info.action == '') {
                    this.$Message({type:'error',message:'您未做修改！'})
                    return
                }
                if(this.ishandle){
                    this.$emit('sure',this.info)
                }

            }
        },

        created() {
            this.loadNewAddress();
            this.showClassify();
            this.orderDetail.guid = this.detail.sn
            this.orderDetail.createdtime = this.detail.createdtime
            this.orderDetail.fixedtime = this.detail.appointment
            this.orderDetail.dept = this.detail.classifyname
            this.orderDetail.classifyId = this.detail.classifyid
            this.orderDetail.catalog = this.detail.catalogname
            this.orderDetail.catalogId = this.detail.catalogid
            this.orderDetail.askdept = this.detail.startaddress
            this.orderDetail.bedno = this.detail.startbed
            this.orderDetail.address = this.detail.finishaddress
            this.orderDetail.memo = this.detail.message
            this.orderDetail.tour = this.detail.tackle
            this.orderDetail.id = this.detail.id
            this.orderDetail.action = ''
            this.orderDetail.attribute = this.detail.attribute
            for(var prop in this.orderDetail) {
                this.inputData[prop] = this.orderDetail[prop]
                this.info[prop] = this.orderDetail[prop]
            }
            this.classifyId = this.info.classifyId
            // 中山附一
            let cid = Cookies.get('categoryid');
            if(this.$root.$data.lineCid.indexOf(cid) != -1 ) {
                let arr = this.detail.startaddress.split(' ');
                this.patientRom = arr[0]  //his单的起点科室
                if(arr.length>1){
                    this.patientRom = arr[2];
                }
                this.loadPatients()
            }
        }
    }
</script>
<style scoped lang="less">
    @import "../assets/less/alter.less";
</style>
